<template>
    <div class="hm-mm-top" style='display:flex;justify-content: space-between;'>
      <!-- 左边输入搜索 -->
      <div class="hm-mm-top-left">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
          <!-- 左 -->
          <el-form-item :label="search_title.title1">
           <slot name="left"></slot>
          </el-form-item>
          <!-- 右 -->
          <el-form-item :label="search_title.title2" style="margin-left:30px">
            <slot name="right"></slot>
          </el-form-item>
          <el-form-item>
            <el-button @click='clearMsg'>清除</el-button>
            <el-button type="primary" @click="SearchOnSubmit">搜索</el-button>
          </el-form-item>
        </el-form>
      </div>
      <!-- 右边新增技巧 -->
      <div class="hm-mm-top-right">
        <el-button type="text" @click="$router.back()">{{search_title.routetitle}}</el-button>
       <el-button type="success" @click="Visible"><i class="el-icon-edit" style="margin-right: 10px;"></i>{{search_title.buttonData}}</el-button>
      </div>
    </div>
</template>

<script>
export default {
  props:{
    formInlineMsg:{
      type:Object,
      required:false,
    },
    articledialogVisibleMsg:{
      type:Boolean,
      required:false,
    },
    search_title:{
      type:Object,
      required:false,
    },
  },
  data () {
    return {
      formInline:this.formInlineMsg,
      articledialogVisible:this.articledialogVisibleMsg
    }
  },
  methods: {
    SearchOnSubmit() {
      this.$emit('SearchMsg')
    },
    clearMsg(){
      this.$emit('formInline')
    },
    Visible(){
      this.$emit('articledialogVisible_a',!this.articledialogVisible)
    },
    open(){
      console.log(11);
    }
  }
  }
  </script>

  <style scoped lang='scss'>
  .hm-mm-top{
    margin-top: 10px;
    .hm-mm-top-left{
      margin-left: 25px;
    }
    .hm-mm-top-right{
      margin-right: 8px;
    }
  }
</style>
